<template>
  <div>
    <h2>{{ $t("pages.dashboard.welcome.tips") }}</h2>
    <div class="demo-wrapper">
      <a-button @click="showLoading" style="margin-right: 12px">
        {{ $t("pages.dashboard.welcome.show-loading") }}
      </a-button>
      <a-button @click="hideLoading" style="margin-right: 12px">
        {{ $t("pages.dashboard.welcome.hide-loading") }}
      </a-button>
      <a-button @click="uploadFile"> 资源上传 </a-button>
    </div>
    <a-drawer
      title="资源上传"
      placement="right"
      width="640"
      :closable="false"
      :visible="visible"
      @close="onClose"
    >
      <upload></upload>
    </a-drawer>
  </div>
</template>

<script>
import Upload from "@/components/Upload/Index";
export default {
  name: "WelcomePage",
  data() {
    return {
      visible: true,
    };
  },
  components: {
    Upload,
  },
  methods: {
    uploadFile() {
      this.visible = true;
    },
    onClose() {
      this.visible = false;
    },
    showLoading() {
      this.$loading.show({ tip: "3 秒后自动隐藏" });

      setTimeout(() => {
        this.$loading.hide();
      }, 3000);
    },
    hideLoading() {
      this.$loading.hide();
    },
  },
};
</script>

<style lang="less" scoped>
</style>
